<template>
	<view class="zog">
		<view class="top">
			<view class="top-top">
				{{detail.balance}}
			</view>
			<view class="top-bottom">
				账户余额（元）
			</view>
		</view>
		<view class="recharge">
			<view class="monthds">
				推荐充值
			</view>
			<view class="recharge-bottom">
				<view class="recharge-item" v-for="(item,index) in recharge" key="index"
					@click="xuanzeFn(item.money,item.plan_id,index)" :class="check ==index?'recharge-item1' : 'recharge-item'">
					<view class="recharge-money">
						充{{item.money}}元
					</view>
					<view class="recharge-give">
						赠送{{item.give_money}}元
					</view>
				</view>
			</view>
		</view>
		<view class="input">
			￥<input type="number" placeholder="自定义充值金额" placeholder-style="" v-model="inputmoney">
		</view>
		<view class="chonghi">
			<view class="">
				充值说明
			</view>
			<view class="chonf1">
				1、消费时优先消费充值金额，充值金额消费完毕后消费赠送金额
			</view>
			<view class="chonf1">
				2、赠送金额不可提现
			</view>
		</view>
		<view class="lijji" @click="rechargeFn()">
			立即充值
		</view>
	</view>
</template>

<script>
	import {
		pay
	} from '@/common/pay.js';
	export default{
		data() {
			return {
				inputmoney:null,
				check:-1,
				money:'',
				plan_id:-1,
				balance: '',
				balanceType: false,
				bT:true,
				type: 0,
				loading: true,
				order_id: 0,
				/* 0创建订单;10 20保证金 30直播充值 40充值 50预售定金 60尾款*/
				order_type: 0,
				pay_type: 20,
				checkedPay: [],
				payPrice: '',
				isPay: false,
				recharge: [],
				detail: {
					balance: 0,
					points: 0,
					grade: {
						name: ''
					},
				},
			}
		},
		onLoad(e) {
			let self = this;
			this.getData();
			self.getfuliFn()
			// this.jinyong()
		},
		methods:{
			xuanzeFn(money,plan_id,index){
				this.money=money;
				this.plan_id=plan_id;
				this.check=index
				// if(this.check==index){
				// 	this.check=-1;
				// 	this.money='';英文
				// 	this.plan_id='';
				// }
			},
			getfuliFn(){
				let that = this
				console.log(1111111111);
				that._get('balance.plan/list',{},function(res){
					console.log(res,'77777777777777777');
					that.recharge=res.data
				})
			},
			rechargeFn() {
				
				let that = this
				var pattern = /^[1-9]\d*$/;
				// console.log(that.inputmoney);
				
				if(that.inputmoney==null&&that.money==''){
					uni.showToast({
						title: '请选择充值金额',
						icon: 'none',
					}, 1000);
					return false
				}
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				if(that.plan_id >0){
					
					that._post(
						'balance.plan/submit', {
							plan_id: that.plan_id,
							user_money: that.money,
							pay_source: 'wx'
						},
						function(res) {
							uni.hideLoading();
							// console.log(res,'2222222222222');
							pay(res, self, function() {
								uni.showToast({
									title: '充值成功',
									icon: 'none',
								}, 1000);
								// setTimeout(function() {
								// 	uni.navigateBack();
								// }, 1000);
								that.getData()
							}, function() {
								uni.showToast({
									icon: 'none',
									title: '充值失败'
									});
								})
							}, err => {
								
							});
				}else if(that.plan_id==-1){
					// const zero = /^(0{2,})|[^0-9]/g
					if(!pattern.test(that.inputmoney)){
					    //是正整数，进行下一步操作
						uni.showToast({
							title: '充值金额为整数',
							icon: 'none',
						}, 1000);
						return false
					}
					that.money='';
					that.plan_id=-1;
					that.check=-1;
					that._post(
						'balance.plan/submit', {
							plan_id: that.plan_id,
							user_money: that.inputmoney,
							pay_source: 'wx'
						},
						function(res) {
							uni.hideLoading();
							// console.log(res,'2222222222222');
							pay(res, self, function() {
								that.money='';
								that.plan_id=-1;
								that.check=-1;
								that.inputmoney=null;
								uni.showToast({
									title: '充值成功'
								}, 1000);
								// setTimeout(function() {
								// 	uni.navigateBack();
								// }, 1000);
								that.getData()
							}, function() {
								uni.showToast({
									icon: 'none',
									title: '充值失败'
									});
								})
							}, err => {
								
							});
				}
				// let a = {
				// 	plan_id: 0,
				// 	user_money: allmoney
				// }
				that._post(
					'balance.plan/submit', {
						plan_id: that.plan_id,
						user_money: that.money,
						pay_source: 'wx'
					},
					function(res) {
						uni.hideLoading();
						// console.log(res,'2222222222222');
						pay(res, self, function() {
							that.money='';
							that.plan_id=-1;
							that.check=-1;
							that.inputmoney=null;
							uni.showToast({
								title: '充值成功'
							}, 1000);
							// setTimeout(function() {
							// 	uni.navigateBack();
							// }, 1000);
							that.getData()
						}, function() {
							uni.showToast({
								icon: 'none',
								title: '充值失败'
								});
							})
						}, err => {
			
						});
			
					},
					getData() {
						let self = this;
						self.isloadding = true;
						self._get('user.index/detail', {
							url: self.url
						}, function(res) {
							if (res.data.getPhone) {
								//#ifdef MP-WEIXIN
								self.gotoPage('/pages/login/bindmobile');
								//#endif
								//#ifndef MP-WEIXIN
								self.bindMobile();
								//#endif
								return;
							}
							self.detail = res.data.userInfo;
							// self.sign = res.data.sign;
							// self.coupon = res.data.coupon;
							// self.orderCount = res.data.orderCount;
					
							// self.menus = res.data.menus;
							// self.setting = res.data.setting;
							// self.is_recycle = res.data.userInfo.is_recycle;
							// self.msgcount = res.data.msgcount;
							self.loadding = false;
							uni.stopPullDownRefresh();
							self.isloadding = false;
						});
					},
		}
	}

</script>

<style scoped lang="scss">
	.lijji{
		background-color: #2b5ba9;
		height: 70rpx;
		color: #fff;
		text-align: center;
		line-height: 70rpx;
		width: 94%;
		margin-left: 3%;
		margin-top: 170rpx;
		border-radius: 16rpx;
		
	}
	.chonghi{
		margin-top: 50rpx;
		font-size: 27rpx;
		color: #ccc;
		padding: 0rpx 31rpx;
		line-height: 50rpx;
		.chonf1{
			font-size: 23rpx
		}
	}
	.input{
		display: flex;
		font-size: 40rpx;
		padding: 0rpx 31rpx;
	}
	.zog{
		background-color: #fff;
	}
	.top{
		padding-top: 40rpx;
		text-align: center;
		.top-top{
			font-size: 80rpx;
		}
		.top-bottom{
			font-size: 23rpx;
		}
	}
	.recharge {
		margin-top: 127rpx;
		padding: 0rpx 31rpx;
		background-color: #fff;
		.monthds{
			font-size: 28rpx;
		}
	}
	
	.recharge-bottom {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	
	}
	
	.gary {
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #CCCCCC;
	}
	
	.recharge-item {
		width: 45%;
		border: 1rpx solid #ccc;
		border-radius: 10rpx;
		text-align: center;
		padding-top: 21rpx;
		padding-bottom: 21rpx;
		box-sizing: border-box;
		margin-bottom: 50rpx;
	}
	.recharge-item1{
		width: 45%;
		border: 1rpx solid #2b5ba9;
		border-radius: 10rpx;
		text-align: center;
		padding-top: 21rpx;
		padding-bottom: 21rpx;
		box-sizing: border-box;
		margin-bottom: 50rpx;
		background-color: rgba(43, 91, 169, 0.2);
	}
	.recharge-money {
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #323232;
		padding-bottom: 5rpx;
	}
	
	.recharge-give {
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FF4D2F;
	}
</style>